<template id="head">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <title data-translation="title">Webduino Blockly - 控制三軸加速度計旋轉圖片角度</title>
  <!-- webduino -->
  <script src="/lib/webduino-all.min.js"></script>
  <script src="/lib/webduino-blockly.js"></script>
  <script src="/lib/runtime.min.js"></script>
</template>
<template id="body">
  <div id="show">
  x: <span id="x"></span><br/>
  y: <span id="y"></span><br/>
  z: <span id="z"></span><br/>
  roll: <span id="r"></span><br/>
  pitch: <span id="p"></span><br/>
  </div>
    <div id="box">
    <img src="/media/webduino-logo.jpg" id="image">
  </div>
</template>
<template id="css">
#box {
  position: relative;
}

#image {
  position: absolute;
  top: 0;
  left: 0;
  width: 200px;
  transform-origin: 150px 150px;
}

#show {
  font-size: 16px;
  margin-bottom: 10px;
}
</template>
